iT邦幫忙

2019 iT 邦幫忙鐵人賽

DAY 8
0
自我挑戰組

JS30自我學習筆記系列 第 8

第七堂 - Array Cardio Day 2

  • 分享至 

  • xImage
  •  

今天算是接續第四堂的Array Cardio Day 1練習,所以同樣是沒有介面的實作課程。這堂課影片只有七分多鐘的時間,內容也非常好懂,包含some、every、find、findIndex四個函式。雖然說很簡單,但卻很重要,如同第四堂課所說,Array是非常常用的資料型態,熟悉他的函式能夠幫助提升我們寫程式的效率。就讓我們看看函式們怎麼使用吧!

邏輯流程

在教材中已經有幫你建立好兩個分別叫people和comments的Array,people裡資料有name跟year(出生年),comments則有text跟id。而這堂課有四個小練習:

  1. 根據people Array,是否有人大於等於19歲?
  2. 根據people Array,每個人都大於等於19歲?
  3. 從comments Array找出ID為823423的comment
  4. 從comments Array刪除ID為823423的comment

課程重點

  1. some():回傳boolean值,判斷是否有成員符合條件。
    const now = new Date().getFullYear();
    const isAdult = people.some(person => (now-person.year)>=19);
    console.log(isAdult);
    
  2. every():回傳boolean值,判斷是否所有成員皆符合條件。
    const isEveryAdult = people.every(person => (now-person.year)>=19);
    console.log(isEveryAdult);
    
  3. find():用法和filter一樣,差別在於filter回傳一個Array,find回傳一筆資料。若同時有多筆資料符合條件,則回傳第一筆符合的資料。
    const comment = comments.find(comment => comment.id == 823423);
    console.log(comment);
    
  4. findIndex():用法和find一樣,差別在於回傳的是該筆資料在Array中的索引值。
    const index = comments.findIndex(comment => comment.id == 823423);
    console.table(index);
    
  5. 刪除Array成員:第四小題在找到索引值後要刪除該筆資料。
    comments.splice(index,1);
    

延伸閱讀

  • splice():可插入或取代成員至Array中。
    rray.splice(index, howmany, item1, ....., itemX)
    ``
    index是插入位置,howmany是要移除index後幾個成員,item是要插入之成員。而實作中利用splice()來刪除成員,就是設定插入位置的index後,將howmany設1,而不設定item,就會刪除在index位置的成員。
    

上一篇
第六堂 - Type Ahead
下一篇
第八堂 - Fun with HTML5 Canvas
系列文
JS30自我學習筆記30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言